<template>
<div class="goodsOrderSetting">
  <el-form :model="model" label-width="110px" :rules="rules" ref="form">
    <el-form-item prop="payTimeOut" label="订单超过:">
      <el-input v-model.number="model.payTimeOut">
        <template slot="append">分</template>
      </el-input><span>未付款，订单自动关闭</span>
    </el-form-item>
    <el-form-item prop="sendTimeOut" label="发货超过:">
      <el-input v-model.number="model.sendTimeOut">
        <template slot="append">天</template>
      </el-input>
      <span>未收货，订单自动完成</span>
    </el-form-item>
    <el-form-item prop="closeTimeOut" label="订单完成超过:">
      <el-input v-model.number="model.closeTimeOut">
        <template slot="append">天</template>
      </el-input>
      <span>自动结束交易，不能申请售后</span>
    </el-form-item>
    <el-form-item prop="commentTimeOut" label="订单完成超过:">
      <el-input v-model.number="model.commentTimeOut">
        <template slot="append">天</template>
      </el-input>
      <span>自动五星好评</span>
    </el-form-item>
    <div class="form-footer" v-if="init">
      <el-button type="primary" @click="save">保存</el-button>
    </div>
  </el-form>
</div>
</template>

<script>
export default {
  name: "goodsOrderSetting",
  inject: ['pattern'],
  data(){
    return{
      init: false,
      model: {
        id: '',
        sendTimeOut: 0,
        payTimeOut: 0,
        commentTimeOut: 0,
        closeTimeOut: 0
      },
      rules: {
        sendTimeOut: [
          {required: true, message: '请输入发货超时时间', trigger: 'blur'},
          {min: 1, type: 'number', message: "请输入大于0的整数", trigger: "blur"}
        ],
        payTimeOut: [
          {required: true, message: '请输入收货超时时间', trigger: 'blur'},
          {min: 1, type: 'number', message: "请输入大于0的整数", trigger: "blur"}
        ],
        commentTimeOut: [
          {required: true, message: '请输入评论超时时间', trigger: 'blur'},
          {min: 1, type: 'number', message: "请输入大于0的整数", trigger: "blur"}
        ],
        closeTimeOut: [
          {required: true, message: '请输入结束交易超时时间', trigger: 'blur'},
          {min: 1, type: 'number', message: "请输入大于0的整数", trigger: "blur"}
        ],
      }
    }
  },
  created(){
    this.initInfo();
  },
  methods:{
    initInfo(){
      this.$yAxios({
        url: this.$api.goods.queryOrderSetting,
        loading: true,
      }, info => {
        this.$set(this, 'model', Object.gain(info, Object.keys(this.model), 0));
        this.model.id = info.id || '';
        this.init = true;
      })
    },
    save(){
      this.$refs['form'].validate(valid => {
        valid && this.$yAxios({
          url: this.$api.goods.saveOrderSetting,
          data: this.model,
          loading: true,
        }, info => {
          this.$message({
            type: 'success',
            message: '保存成功'
          });
          this.initInfo();
        })
      })
    }
  }
}
</script>

<style scoped lang="less">
.goodsOrderSetting{
  text-align: center;
  >.el-form{
    padding: 40px;
    display: inline-block;
    /deep/ .el-form-item__content{
      text-align: left;
      >.el-input{
        width: 200px;
      }
      >span{
        display: inline-block;
        padding-left: 10px;
      }
    }
  }
  .form-footer{
    text-align: center;
    margin-top: 50px;
  }
}
</style>